<template>
	<view class="itemsss">
		<view class="yhd">


			<u-tabs :list="hhList" :current="tabsId" @click="tabsOn" scrollable="true" @change="change"></u-tabs>
		</view>
		<u-notice-bar v-if="pageLogo!='coupon'&&pageLogo!='freeConpon'" :text="text1" mode="closable"></u-notice-bar>
		<!-- <view class="yhData" style="100%"> -->
		<swiper :current="tabsId" @change="wzhd" :style="{ height: wsyData * 150 + 'px', backgroundColor:'#f0f5ff'}">
			<swiper-item v-for="(tab, index) in hhList" :key="index">
				<view class="itemdata" v-if="tab.listdata.length>0">

					<eachCouponVue v-if="pageLogo=='coupon'" :listdata="tab.listdata"></eachCouponVue>
					<eachCouponVue v-else-if="pageLogo=='freeConpon'" :listdata="tab.listdata"></eachCouponVue>

					<view v-else style="height: auto;">
						<!-- {{tab.name}}
						{{tab.status}} -->
						<orderItemVue v-for="item in sjData" :key="item.id" :item="item"></orderItemVue>
						<!-- <orderItemVue></orderItemVue> -->

						<!-- 

						<view class="ypj">

							<view class="itempj">
								<view class="tx">
									<view class="lef">
										<u-avatar src="/static/相机.png"></u-avatar>
									</view>
									<view class="ri">
										<text>J***(匿名)</text>
										<text>jik-j</text>
										<text class="sj">2025.02.21 16:04:37 评价</text>
									</view>

								</view>
								<view class="xinxi">
									<text>用户进行了评价</text>
									<text>还用户觉得服务{{较好}}</text>
								</view>
								<view class="pfqk">
									<text> 综合评分：5星</text>
									<text>|</text>
									<text>服务种类：保洁清洗X1+油烟机清洗X1</text>
								</view>
								<navigator>
									<view class="sp">
										<image src="/static/tp.png" mode=""></image>
										<text>保洁清洗X1+油烟机清洗X1</text>
									</view>
								</navigator>
								<view class="btn">
									<text></text>

									<view class="bt">
										<u-button color="#7a7a7a" type="primary" size="mini" shape="circle"
											:plain="true" text="追评"></u-button>
									</view>
								</view>
							</view>

						</view> -->
					</view>


				</view>
				<view class="" v-else>
					<u-empty mode="coupon">
					</u-empty>
				</view>
			</swiper-item>
		</swiper>





	</view>
</template>

<script>
	/**
	 * @description 优惠券选择部分
	 */
	import orderItemVue from '../../otherPage/orderItem/orderItem.vue';
	import eachCouponVue from '../eachCoupon/eachCoupon.vue'
	export default {
		components: {
			eachCouponVue,
			orderItemVue
		},
		data() {
			return {
				tabsId: 0,
				hhList: [],
				text1: "注意：工作人员工作时无法取消订单，当工作人员已上门且工作完成之后退款需扣除服务费用的10%作为误工费 ",
				sjData: [],
				e: ''
			}
		},

		watch: {
			index(newName, oldName) {
				console.log("index" + newName)
				this.tabsId = newName;
			},
			tabsId(news, old) {
				console.log(news, old);
				// const e = null;
				if (news == 0) {
					// this.e = 6
					this.getList()
				}

				// console.log("this", this.e);

				if (news == 1) {
					// this.e = news - 1
					this.getOlder(0)
				}
				if (news == 2) {
					// this.e = news - 1
					this.getOlder(1)
				}
				if (news == 3) {
					// this.e = news - 1
					this.getOlder(6)
				}
				if (news == 4) {
					// this.e = news - 1
					this.getOlder(3)
				}
			}
		},
		computed: {
			wsyData() {
				if (this.pageLogo == "myOrder") {
					return this.sjData.length
				} else {
					return this.list2[0].listdata.length
				}

			}
		},
		created() {
			// console.log("xx"+this.wsyData);
			// console.log(this.list2);
			if (this.pageLogo == "coupon") {
				this.list2[0].badge.value = this.list2[0].listdata.length
			}
			this.hhList = this.list2
		},
		props: ["list2", "pageLogo", "index"],
		methods: {
			getList() {
				const aa = uni.getStorageSync("userinfo")
				this.$http.get('/buyrOrder/userlist', {
					params: {
						userid: JSON.parse(aa).id
					}
				}).then(res => {
					console.log('res', res);
					this.sjData = res.result
				})
			},
			getOlder(e) {
				this.$http.post('/buyrOrder/tjSearch', {
					orderStatus: e,
				}).then(res => {
					console.log('res', res);
					this.sjData = res.result
				})
			},
			change(e) {
				console.log("qiehuan", e);
			},
			tabsOn(e) {
				//点击的时候切换的函数
				this.tabsId = e.index;
				// console.log(e);
			},

			wzhd(e) { //滑动切换的时候调用的函数
				this.tabsId = e.detail.current
				// console.log(e.detail.current);
			}
		}
	}
</script>

<style lang="less" scoped>
	.itemsss {
		// display: flex;
		// flex-direction: column;

		// justify-content: center;
		// align-items: center;
		.yhd {

			display: flex;
			justify-content: center;
			// background-color: blue;
		}

		// .yhData {
		// 	background-color: #f0f5ff;


		.itemdata {

			// background-color: #f0f5ff;

			.ypj {

				.itempj {
					border-radius: 8px;
					background-color: #ffffff;
					margin: 8px;
					padding: 8px;

					.tx {
						display: flex;

						.lef {}

						.ri {
							margin-left: 4px;
							display: flex;
							flex-direction: column;
							align-items: flex-start;

							.sj {
								color: #adadad;
								font-size: 14px;
							}
						}
					}

					.xinxi {
						margin-top: 10px;
					}

					.pfqk {
						display: flex;
						margin-top: 9px;

						text {
							font-size: 13px;
							color: #a8a8a8;
							margin-left: 4px;
						}
					}

					.sp {
						margin-top: 5px;
						display: flex;
						align-items: center;

						image {
							width: 45px;
							height: 45px;
							border-radius: 6px;
						}

						text {
							font-size: 16px;
							color: #2c2c2c;
							margin-left: 12px;
						}
					}

					.btn {
						display: flex;
						justify-content: flex-end;

						margin-right: 15px;

						.bt {}
					}


				}

			}


		}

		// }
	}
</style>